<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<%@include file="../../mytags.jsp" %>
<t:base type="jquery"></t:base>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <meta name="viewport"
          content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no"/>
    <link rel="stylesheet" href="webpage/com/wx/wx-plug-in/plugin/picker/css/mui.picker.all.css">
    <script type="text/javascript" src="webpage/com/wx/wx-plug-in/plugin/picker/js/mui.picker.all.js"></script>
    <title>巡检详情</title>

</head>
<body>

<script type="text/javascript">

    function cancelPlan() {
        var msg = "您的服务单已经在处理中，如需取消请联系中影巴可24小时服务热线<br/><a href='tel:400-88-22726' style='color:blue'>400-88-22726</a>";
        mui.alert(msg);
    }

    function confirmOrderTime(inspectionId) {
        var mask = mui.createMask(function () {
            return false;
        });
        mask.show();
        $.post("inspectionWx.do?confirmOrderTime", {inspectionId: inspectionId}, function (data) {
            if (!$.isEmptyObject(data)) {
                data = $.parseJSON(data);
                if (data.success) {
                    mui.confirm("确认成功", '提示', ["确定"], function () {
                        mui.openWindow({
                            createNew: true,
                            url: location.href
                        });
                    });

                } else {
                    mask.close();
                }
            }
        })
    }
</script>
<div class="eq1">
    <div class="geren" style="font-weight: bold;margin:10px 0px 10px 15px;">
        <img src="${webRoot }/images/about.jpg">服务单详情
    </div>
    <div class="inrr inrr1 inrr2 inrr-plus">
        <h4><span>设备序列号</span>${plan.equipmentSpare.sn}&nbsp;</h4>
        <h4><span>机型</span>${plan.equipmentSpare.type.typeDesc}&nbsp;</h4>
        <h4><span>巡检ID</span>${plan.planId}&nbsp;</h4>
        <h4 style="color: #0eb972;"><span>当前状态</span>
            ${state.planStateText}
        </h4>
        <c:if test="${state.planStateText eq '巡检准备中' || state.planStateText eq '已预约'}">
        <h4><span>计划巡检时间</span><input type="text" id="ipPlanDate"
                                  style="width:30%;margin-bottom: 0px;border:1px solid white;height: 20px;font-size:14px;padding:0;"
                                  value="<fmt:formatDate value="${plan.ipPlanDate}" pattern="yyyy-MM"/>" readonly/>
        <%--<h4><span>希望服务季度</span><t:dictSelect field="planQuarter" type="span" typeGroupCode="planInspectionQuarter"
                                             defaultVal="${plan.planQuarter}"/></h4>--%>

        </c:if>
        <c:if test="${state.planStateText eq '已完成'}">
        <h4><span>完成时间</span><fmt:formatDate value="${plan.endTime}" pattern="yyyy-MM-dd"/>&nbsp;</h4>
        </c:if>
        <c:if test="${state.planStateText eq '已取消'}">
        <h4><span>取消时间</span><fmt:formatDate value="${plan.updateDate}" pattern="yyyy-MM-dd HH:mm:ss"/>&nbsp;</h4>
        <h4><span>取消原因</span>
            <c:if test="${not empty cancelReason}">
                <div style="width: 70%;margin-left: 28%;word-wrap : break-word ;word-break: break-all;">
                        ${cancelReason}
                </div>
            </c:if>
            &nbsp;
        </h4>
        </c:if>
    </div>
    <c:if test="${state.planStateText eq '已预约' or state.planStateText eq '已完成'}">
    <div class="inrr inrr1 inrr2 inrr-plus" style="margin-top: 10px;">
        <h4><span>工程师姓名</span>${plan.engineer.tsBaseUser.realName}</h4>
        <h4><span>工程师电话</span>${plan.engineer.tsBaseUser.mobilePhone}</h4>
        <h4><span>工程师编号</span>${plan.engineer.engineerNo}&nbsp;</h4>
        <h4><span>预约上门时间</span><fmt:formatDate value="${plan.engineerOrderTime}" pattern="yyyy-MM-dd"/>&nbsp;</h4>
        <c:if test="${state.planStateText eq '已完成'}">
        <h4><span>工程师评语</span>
            <c:if test="${not empty report}">
                <div style="width: 70%;margin-left: 28%;word-wrap : break-word ;word-break: break-all;">
                        ${report.comprehensiveEvaluation}
                </div>
            </c:if>
            &nbsp;
        </h4>
        </c:if>
    </div>
    </c:if>
</div>
<c:if test="${(state.planStateText eq '巡检准备中' || state.planStateText eq '已预约') && state.canUpdateOrdertime eq '0'}">
<div class="geren" style="font-size: 0.5em;padding-right: 5px;">
    此巡检计划的巡检时间已发生过变更。如需再次修改请致电巴可服务热线<a href="tel:4008822726" style="color:blue;">400-88-22726</a>
</div>
</c:if>
<div class="mui-content-padded" id="div-btn" style="margin:5px auto;padding:0 8px;width:100% !important;text-align: center !important;">
    <c:if test="${state.planStateText eq '巡检准备中' || state.planStateText eq '已预约'}">
        <a class=" mui-btn-block mui-btn-primary" onclick="cancelPlan()">取消巡检</a>
        <a class="mui-btn-block mui-btn-primary" id="btUpdatePlanDate" onclick="updateIpPlanDate('${plan.id}')">修改巡检时间</a>
    </c:if>
    <c:if test="${not empty plan.evaluate && plan.evaluate.evaluateState=='0' && plan.state =='j_inspection_complete'}">
        <a class=" mui-btn-block mui-btn-primary"
           href="inspectionWx.do?goInspectionEvaluate&inspectionId=${plan.id}">去评价</a>
    </c:if>
    <c:if test="${state.planStateText eq '已预约' && plan.confirmOrderTime==0}">
        <a class=" mui-btn-block mui-btn-primary" onclick="confirmOrderTime('${plan.id}')">确 认</a>
    </c:if>
    <c:if test="${plan.companyHadAreaEg == '1' && plan.confirmOrderTime==0 && plan.state =='i_aeg_assigned'}">
        <a class=" mui-btn-block mui-btn-primary" onclick="confirmOrderTime('${plan.id}')">确 认</a>
    </c:if>
</div>


</body>
<script type="text/javascript" charset="utf-8">
    mui.init();
    var origIpPlanDate = "<fmt:formatDate value="${plan.ipPlanDate}" pattern="yyyy-MM"/>";
    function updateIpPlanDate(planId) {

        $('#ipPlanDate').trigger("click");
    }

    function rebuildButton() {
        if ($(".inrr2").find("h4").length > 5) {
            var btn = $("#div-btn");
//            btn.width("93%");
            btn.addClass("btn-fixed");
            if (btn.find("a").length % 2 == 0) {
                btn.find("a").eq(0).css({
                    "width": "40%",
                    "float": "left",
                    "margin-left": "20px"
                });
                btn.find("a").eq(1).css({
                    "width": "40%",
                    "float": "right",
                    "margin-right": "20px"
                })
            }
        }
    }

    function planDateClick(){
        mui.confirm("修改巡检时间会变更贵影院所有巡检设备的巡检时间，并且在一个巡检周期内，微信端只能修改一次。是否确认修改？","巡检年月", ['取消', '确认'],function(btn1){
            if (btn1.index == 1) {
                var d = new Date();
                var o = $('#ipPlanDate');
                var dtpicker = new mui.DtPicker({
                    beginDate: $.isEmptyObject(origIpPlanDate) ? new Date() : new Date(origIpPlanDate + '-01'),
                    endDate : new Date(d.getFullYear(),11),
                    type: "month",//设置日历初始视图模式
                    labels: ['年', '月', '日', 'Hour', 'min'],//设置默认标签区域提示语
                    customData: {
                        h: [
                            {value: 'AM', text: 'AM'},
                            {value: 'PM', text: 'PM'}
                        ]
                    }//时间/日期别名
                })
                dtpicker.show(function (selectedItems) {
                    if (!$.isEmptyObject(selectedItems.value) && selectedItems.value != origIpPlanDate) {
                        mui.confirm('确认修改巡检年月至' + selectedItems.value + "吗？", "巡检年月", ['取消', '确认'], function (btn) {
                            if (btn.index == 1) {
                                var updateFlag = false;
                                $.ajax({
                                    url: "inspectionWx.do?updateIpPlandate",
                                    data: {
                                        id: "${plan.id}",
                                        planDate: selectedItems.value
                                    },
                                    async: false,
                                    dataType: "json",
                                    success: function (data) {
                                        updateFlag = data.success;
                                        /*o.val(updateFlag ? selectedItems.value : origIpPlanDate);
                                         checkToShowPlandateBtn();*/
//                                    mui.alert(data.msg, '提示');
                                        if (data.success) {
                                            mui.confirm("巡检时间修改成功",["确认"],function(btn2){
                                                mui.openWindow({
                                                    createNew: true,
                                                    url: 'inspectionWx.do?goInspectionDetail&id=${plan.id}'
                                                })
                                            })
                                        } else {
                                            mui.alert(data.msg);
                                            return;
                                        }
                                    }
                                })

                            } else {
                                o.val(origIpPlanDate);
                            }
                        })
                    }

                })
            }
        })

    }

    $(function () {
        checkToShowPlandateBtn();

        $('#ipPlanDate').bind("click",planDateClick);

        function checkToShowPlandateBtn() {
            $.getJSON("inspectionWx.do?canUpdatePlanDate", {planId: '${plan.id}'}, function (data) {
                $("#ipPlanDate").unbind("click",planDateClick);
                if (data.success) {
                    $("#btUpdatePlanDate").show();
                    $("#ipPlanDate").bind("click",planDateClick);
                } else {
                    $("#btUpdatePlanDate").remove();
                }
                rebuildButton();
            })
        }


    })
</script>
</html>